<!DOCTYPE html>
<html>
<head>
    <title>Cello</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!--CSS style sheets-->
    <link href="../css/bootstrap.min.css" rel="stylesheet" media="screen">
    <link href="../css/bootstrap-responsive.min.css" rel="stylesheet" media="screen">
    <link href="../css/click_truthtable.css" rel="stylesheet" type="text/css" />


    <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
    <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>

    <script language='javascript' type='text/javascript' src='../jsLibraries/jquery.flot.js'></script>
    <script language='javascript' type='text/javascript' src='../jsLibraries/jquery.flot.axislabels.js'></script>
    <script language='javascript' type='text/javascript' src='../jsLibraries/jquery-jsplumb-1-5-1-min.js'></script>


    <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
    <!--<script src="http://code.jquery.com/jquery-1.10.2.js"></script>-->
    <script src="http://code.jquery.com/ui/1.11.3/jquery-ui.js"></script>


    <script language='javascript' type='text/javascript' src='fe/assign.js'></script>
    <script language='javascript' type='text/javascript' src='fe/dag.js'></script>
    <script language='javascript' type='text/javascript' src='fe/load.js'></script>
    <script language='javascript' type='text/javascript' src='fe/netlist.js'></script>
    <script language='javascript' type='text/javascript' src='fe/numeric.js'></script>
    <script language='javascript' type='text/javascript' src='fe/placedivs.js'></script>
    <script language='javascript' type='text/javascript' src='fe/plotting.js'></script>
    <script language='javascript' type='text/javascript' src='fe/plumbing.js'></script>
    <script language='javascript' type='text/javascript' src='fe/printgraph.js'></script>
    <script language='javascript' type='text/javascript' src='fe/score.js'></script>
    <script language='javascript' type='text/javascript' src='fe/simulatelogic.js'></script>
    <script language='javascript' type='text/javascript' src='fe/simulaterpu.js'></script>


</head>
<body data-spy="scroll" data-target="#sidebar">


<h1></h1>


<button class="btn btn-large" onclick="nextAssignment();" type="button">Next assignment </button>

<div id="assignment_number" style="float: right; margin-right: 50px"></div>
<div id="score"></div>


<br style="clear: both">
<br>
<div style="width: 775px; float: left; margin-left: 10px; margin-top: 600px"><pre id="print_graph"></pre></div>
<div id="best_score" style="height: 250px; width: 400px; float: left; margin-left: 10px; margin-top: 600px"></div>

<br style="clear: both">

<div id="circuit_plot"></div>

<button class="btn btn-large" onclick="nextAssignment();" type="button">Next assignment </button>


<script type ="text/javascript">

    var assignment = -1;

    var inputs = getInputs();
    var outputs= getOutputs();

    var netlist_string = getNetlist();

    var circuit = getDAG(netlist_string, inputs, outputs);

    setLogic(circuit);
    assignInputs(circuit);

    var biogates = getBioGates();

    var indexes_set = permute([0, 1, 2, 3, 4]);
    indexes_set.reverse();

    var all_scores = [];
    var best_scores = [];
    var best_score = 0.0;


    firstAssignment();



</script>

</body>
</html>

<style>

    pre {
        font-size: 10px;
    }

    .flot_div {
    }


    .window { z-index:20; }
    ._jsPlumb_connector { z-index:4; }
    ._jsPlumb_endpoint { z-index:5; }
    ._jsPlumb_overlay { z-index:6; }


    svg path {
        stroke:gray;
    }

    svg circle {
        fill:gray;
        stroke:gray;
    }



</style>
